﻿@using WineStore.Extends;
@model PagedList.IPagedList<WineStore.Models.Product>
@{
    ViewBag.Title = "ShowProduct";
    Layout = "~/Views/Shared/AdminLayout.cshtml";
    AjaxOptions ajaxOpts = new AjaxOptions
    {
        UpdateTargetId = "tabledata"
    };
}

@section Styles
{
    <!--Sử dụng cho paging-->
    <link href="../../Content/PagedList.css" rel="stylesheet" type="text/css" />
    <!--Sử dụng cho autocomplete-->
    <link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
    <!--Sử dụng cho tooltip sort-->
    <style type="text/css">
        div#tipDiv {
            font-size: 11px;
            line-height: 1.2;
            color: Blue;
            background-color: #E1E5F1;
            border: 1px solid red;
            padding: 4px;
            width: 100px;
            border-radius: 5px;
        }

        td {
            text-align: center;
            vertical-align: middle;
        }
    </style>
}

@section Scripts
{
    <!--Sử dụng cho tooltip sort-->
    <script src="../../Scripts/dw_tooltip_c.js" type="text/javascript"></script>
    <!--Sử dụng cho autocomplete-->
    <script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
    <!--Sử dụng cho tooltip sort-->
    <script type="text/javascript">
        dw_Tooltip.content_vars = {
            L1: 'Click here to sort...',
            L2: '',
            L3: ''
        }
    </script>
    <!--Sử dụng cho autocomplete-->
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $('*[data-autocomplete-url]')
        .each(function () {
            $(this).autocomplete({
                source: $(this).data("autocomplete-url")
            });
        });
        });
    </script>
    <!--Sử dụng cho row hover-->
    <script type="text/javascript">
        $(document).ready(function () {
            $("tr").not(':first').hover(function () {
                $(this).css("background", "#F0FFFF");
            }, function () {
                $(this).css("background", "");
            }
            );
        });
    </script>
}

<!-- Table (TABLE) -->
@if (Session["Admin"] != null)
{
    <h3 class="tit">Management Product
    </h3>
    <div style="color: Red; font-size: 13px;" id="update-message">
    </div>
    using (Ajax.BeginForm("ShowProductPartial", ajaxOpts))
    {
    <p>
        Category Name:@Html.TextBox("SearchString", ViewBag.CurrentFilter as string, new { data_autocomplete_url = Url.Action("Autocomplete") })
        <input type="submit" value="Search" style="width:70px; cursor:pointer;"/>
    </p>

        // Sau khi thuc hien ShowProductPartial Action thay doi du lieu trong div tabledata
    <div id="tabledata">
        @Html.Partial("ShowProductPartial")
    </div>
    }
}
else
{
    Response.Redirect("~/Admin/LogOn/");
}